<template>
  <div>
    <home-com></home-com>

    <transition>
      <slot>
        <my-com></my-com>
      </slot>
    </transition>
  </div>
</template>
<style lang="scss">
.v-enter-to {
  transform: translateX(0px);
}

/* 离场之前的类名 */
.v-leave {
  transform: translateX(0px);
}

/* 离场过程的类名 */
.v-leave-active {
  /* transition: transform .3s; */
  transition: transform 1s cubic-bezier(0.27, 1.05, 0.95, -1.36);
}

/* 离场后的类名 */
.v-leave-to {
  transform: translateX(-600px);
}
</style>
<script>
import HomeCom from "@/components/homeCom.vue";
import recommend from "@/components/recommendCom.vue";
export default {
  // name: "Home",
  components: {
    "home-com": HomeCom,
    "my-com": recommend,
  },
};
</script>

